<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:ui="http://java.sun.com/jsf/facelets" lang="es"
	xmlns:pe="http://primefaces.org/ui/extensions">

<h:head>
	<link rel="stylesheet" href="#{request.contextPath}/css/global.css" />
	<link rel="stylesheet" href="#{request.contextPath}/css/custom.css" />
 	<link rel="stylesheet" href="#{request.contextPath}/css/style.css" />
 	<link rel="stylesheet" href="#{request.contextPath}/css/loading.css" />
 	
 	
 	
 	
<!--  	player -->
	<link rel="stylesheet" href="#{request.contextPath}/player/css/zen.css" />
	<link rel="stylesheet" href="#{request.contextPath}/player/customPlayer.css" />

    <script type="text/javascript" src="#{request.contextPath}/player/js/jquery.rotate.js"></script>
    <script type="text/javascript" src="#{request.contextPath}/player/js/jquery.grab.js"></script> 
    <script type="text/javascript" src="#{request.contextPath}/player/js/jquery.jplayer.min.js"></script>
    <script type="text/javascript" src="#{request.contextPath}/player/js/zen.js"></script>
 	
 	<link rel="stylesheet" class="umbrui" href="#{request.contextPath}/player/elements/meter.css"/>
	<link rel="stylesheet" class="umbrui" href="#{request.contextPath}/player/elements/number.css"/>
	<link rel="stylesheet" class="umbrui" href="#{request.contextPath}/player/playList.css"/>
 	
<!--  	player -->
 	
 	
 	
 	
 	
 	
 	<script type="text/javascript">
	function start() {
        startButton1.disable();
        window['progress'] = setInterval(function() {
            var oldValue = pbClient.getValue(),
            newValue = oldValue + 10;

            pbClient.setValue(pbClient.getValue() + 10);

            if(newValue == 100) {
                clearInterval(window['progress']);
            }


        }, 1000);
    }

    function cancel() {
        clearInterval(window['progress']);
        pbClient.setValue(0);
        startButton1.enable();
    }
</script>
 	
</h:head>
<h:body>

		<pe:layout id="fullPage"
			options="#{fullLayoutController.layoutOptions}" 
			stateCookie="true"
			widgetVar="fpLayoutWidget">

			<pe:layoutPane position="west" size="260" maxSize="260" resizable="true">
				<pe:layoutPane position="north" size="120" maxSize="120"
					closable="false" resizable="true" styleContent="overflow:hidden;text-align:center;">
					<ui:include src="layouts/logoBiz.xhtml" />
				</pe:layoutPane>
				<pe:layoutPane position="center">
					<pe:layoutPane position="north" size="40" closable="false"
						resizable="false" styleContent="overflow:hidden;">
						<ui:include src="layouts/search.xhtml" />
					</pe:layoutPane>
					<pe:layoutPane position="center" styleContent="overflow-x:hidden;">
						<ui:include src="layouts/leftMenu.xhtml" />
					</pe:layoutPane>
				</pe:layoutPane>
				<pe:layoutPane position="south" size="60" resizable="false"
					styleContent="text-align:center;overflow:hidden;">
					<h:outputText value="MONKAR" id="mnkrLogo" />
<!-- 					para el loading -->
					<div id="facebookG" style="display:none; margin: auto; margin-top: 5px;">
						<div id="blockG_1" class="facebook_blockG">
						</div>
						<div id="blockG_2" class="facebook_blockG">
						</div>
						<div id="blockG_3" class="facebook_blockG">
						</div>
					</div>
				</pe:layoutPane>
			</pe:layoutPane>


			<pe:layoutPane position="center">

				<div class="ui-widget-content ui-corner-all"
					style="margin-bottom: 6px; border: none;">
					<ui:include src="layouts/topMenu.xhtml" />
				</div>

				<div class="ui-layout-content">
					<pe:layoutPane position="center">
						<pe:layoutPane position="north" size="48" maxSize="48" styleContent="overflow:hidden;"
							resizable="true">
							<ui:include src="layouts/topContent.xhtml" />
						</pe:layoutPane>

						<pe:layoutPane position="center" styleClassContent="pnlPrincipal">
							<f:facet name="header" >
								 <div class="notif-controls">
							        <a class="notif-minimize" onclick="fpLayoutWidget.open('west');fpLayoutWidget.sizePane('center_east',220);
								                            fpLayoutWidget.open('center_center_north');fpLayoutWidget.open('center_center_south');">Minimize</a>
							        <a class="notif-zoom" onclick="fpLayoutWidget.close('west');fpLayoutWidget.sizePane('center_east',5);
								                           	fpLayoutWidget.close('center_center_north');fpLayoutWidget.close('center_center_south');">Zoom</a>
							      </div>
								  <ui:include src="layouts/centerContentTop.xhtml" />
							</f:facet>
							
							
							<ui:include src="layouts/centerContent.xhtml" />
						</pe:layoutPane>
						
						<pe:layoutPane position="south" size="50" maxSize="50" resizable="true" styleContent="overflow-y:hidden;">
						<ui:include src="layouts/footer.xhtml" />
						</pe:layoutPane>
					</pe:layoutPane>
					<pe:layoutPane position="east" size="220" maxSize="220" closable="false">
						<f:facet name="header" >
							<div id="wrapPlayer">
								<div id="zen">
									<span class="player"></span>
									<span class="circle"></span>
									<span class="progress"></span>
									<span class="buffer"></span>
									<span class="drag"></span>
									<div class="button">
										<span class="icon play"></span>
										<span class="icon pause"></span>
									</div>
								</div>
								
							</div>
						</f:facet>
						<ui:include src="layouts/rightAside.xhtml" />
					</pe:layoutPane>
				</div>

			</pe:layoutPane>

		</pe:layout>

	<ui:include src="layouts/adds.xhtml" />

</h:body>
</html>
